<!DOCTYPE html>
<html lang='en'>

<head>
    <meta charset='UTF-8'>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/all.css">
    <link href="https://fonts.googleapis.com/css2?family=Arimo&family=Bebas+Neue&family=Inconsolata&display=swap"
        rel="stylesheet">
    <title>Redeye Record</title>
    <link rel="stylesheet" href="redeye.css">
    <script src="redeye.js"></script>
</head>

<body>

    <header>
        <!-- the first block of the website -->
        <section id='titles'>
            <h2><a href='index.html'>REDEYE</a></h2>
            <h3>DANCE MUSIC SPECIALISTS SINCE 1992
                <span id='hamburger' onclick="showHide('menu')">
                    <a href="javascript:void(0);"><i class="fa fa-bars"></i></a>
                </span>
            </h3>
        </section>

        <nav id='menu'>
            <ul>
                <li><a href='contact.html'>CONTACT</a></li>
                <li><a href='support.html'>SUPPORT</a></li>
                <li><a href='aboutus.html'>ABOUT US</a></li>
                <li><a href=''>MY ACCOUNT</a></li>
                <li><a href=''><i class='fa fa-search'></i></a></li>
                <li><a href='cart.html'><i class="fas fa-shopping-cart"></i></a></li>
            </ul>
        </nav>
    </header>

    <main>
        <!-- The navigation bar -->
        <section class="navigation-wrap" >
            <ul class='navigation'>
                <li><a href="">All</a></li>
                <li><a href="">Genre<i class="fas fa-caret-down"></i></a></li>
                <li><a href="">New Release<i class="fas fa-caret-down"></i></a></li>
                <li><a href="">Sale<i class="fas fa-caret-down"></i></a></li>
                <li class='last-item'><a href="">Pre-orders<i class="fas fa-caret-down"></i></a></li>
            </ul>
        </section>

        <!-- breadcrumb -->
        <ul class="breadcrumb">
            <li><a href="index.html">Home</a></li>
            <li>Contact</li>
        </ul>

        <!-- heading   -->
        <div class='container flex-box flex-wrap'>
            <div class='contact-information flex-1 p1'>
                <div class='large-container'>
                    <section class='form'>
                        <h5 class="text-center p1" style="border-bottom:1px solid #C4CDC1;">CONTACT REDEYE</h5>
                        <div class="contact-img flex-1 p1 m">
                            <img src="./images/envelop.jpg" alt="">
                        </div>
                        <p class="artist">Our team is happy to answer your questions. Fill out the form and we will be in touch as soon as possible.</p>
                        <div class='form-container'>
                            <form action='' id='contact-form'>
                                <label class='contact-input'>Your Name:</label>
                                <input type='text' class='form-input' placeholder='Your Name'>
                                <br>
                                <label class='contact-input'>Email Address:</label>
                                <input type='text' class='form-input' placeholder='Email Address'>
                                <br>
                                <label class='contact-input'>Select your question type:</label>
                                <input type='text' class='form-input' placeholder='Select your question type...'>
                                <br>
                                <label class='contact-input'>Type your question here:</label>
                                <input type='text' class='form-input' placeholder='Type your question here...'>
                            </form>
                        </div>          
                        <div class="text-right">
                            <button class="btn-blue ">Submit Your Enquiry</button>
                        </div>      
                    </section>
                </div>
            </div>
            <div class="contact-img flex-1 p1 m1 pc">
                <img src="./images/envelop.jpg"  alt="">
            </div>
        </div>


    </main>


    <footer>
        <div class="container flex flex-wrap">
            <section class='words flex-1 flex-100'>
                <address>
                    Redeye Records Ltd., Unit 5,<br>
                    Cristal Business Centre, Knightsdale Rd,<br>
                    Ipswich IP1 4JJ<br>
                </address>
                <br><br>
                <strong>Copyright 2020 Redeye Record. A website by Eq.</strong>
            </section>
            <br>
            <section class='socials flex-1 flex-100'>
                <strong>Stay In Touch<strong>
                     <form action=''>
                         <input class="email" type="text" placeholder="Email Address">
                         <label class="email" for="email"><i class="fas fa-arrow-right"></i></label>
                         <br>
                         <input id="agree" type="checkbox">
                         <label for="agree">I agree to the privacy policy and terms and conditions.</label>
                     </form>
                     <p class='footer_icons'>
                         <i class="fab fa-facebook-f"></i>
                         <i class="fab fa-instagram"></i>
                         <i class="fab fa-twitter"></i>
                         <i class="fab fa-pinterest"></i>
                         <i class="fab fa-youtube"></i>
                         <i class="fa fa-envelope"></i>
                     </p>
            </section>
        </div>
    </footer>
</body>

</html>